
.sm-function-module-content {
    max-height: 528px;
    overflow: auto;
    @media (max-width: 750px) {
        margin-top: 2px;
        margin-left: 2px;
        max-width: 280px;
    }
    @media (max-height: 480px) {
        margin-top: 2px;
        margin-left: 2px;
        max-height: 400px;
    }
    @media (max-height: 300px) {
        max-height: 250px;
    }
    @media (max-height: 250px) {
        max-height: 200px;
    }
}


.sm-input-long,
.sm-select,
.sm-colorpicker {
    width: 55%;
}

.sm-solider-input-box {
    float: right;
    width: 72%;
}


.sm-function-module-sub-section {
    .sm-function-module-sub-section {
        margin-bottom: 0;
    }
}

.symbolicLibrary {
    display: flex;
    justify-content: flex-start;
    padding: 5px;
    border: 1px solid rgb(58, 150, 78);
    margin-bottom: 18px;
    flex-wrap: wrap;
    overflow: auto;
    @media (max-height: 480px) {
        margin: 2px;
        max-height: 55px;
    }
    @media (max-height: 300px) {
        max-height: 40px;
    }
    @media (max-width: 450px) {
        margin: 2px;
        max-height: 55px;
    }
    @media (max-width: 375px) {
        max-height: 40px;
    }
    .Thematicbox {
        width: 33px;
        height: 33px;
        margin: 8px 6px;
        @media (max-height: 480px) {
            width: 30px;
            height: 30px;
            margin: 4px 2px;
        }
        @media (max-height: 300px) {
            width: 25px;
            height: 25px;
            margin: 0;
        }
        @media (max-width: 450px) {
            width: 30px;
            height: 30px;
            margin: 4px 2px;
        }
        @media (max-width: 375px) {
            width: 25px;
            height: 25px;
            margin: 0;
        }
        img {
            width: 100%;
            height: 100%;
        }
    }
    .lightSelected {
        border: 1px solid rgb(58, 150, 78);
    }
}
